
import { defineStore } from 'pinia'
import { h } from 'vue'
import * as Icons from '@ant-design/icons-vue';

export const UseMenuStore = defineStore('Menu', {
    state: () => {
        return {
            Menu: [{
                label: '首页', path: '/home', icon: 'HomeOutlined'
            }, {
                label: '文档', path: '/docs', icon: 'BookOutlined', children: [
                    { label: '菜单', path: '/docs/menu', icon: 'MenuOutlined' }
                ]
            },
            { label: '测试页面1', path: '/TestPage/1', icon: 'HomeOutlined' },
            { label: '测试页面2', path: '/TestPage/2', icon: 'HomeOutlined' },
            { label: '测试页面3', path: '/TestPage/3', icon: 'HomeOutlined' },
            { label: '测试页面4', path: '/TestPage/4', icon: 'HomeOutlined' },
            { label: '测试页面5', path: '/TestPage/5', icon: 'HomeOutlined' },
            { label: '测试页面6', path: '/TestPage/6', icon: 'HomeOutlined' },
            { label: '测试页面7', path: '/TestPage/7', icon: 'HomeOutlined' },
            { label: '测试页面8', path: '/TestPage/8', icon: 'HomeOutlined' },
            { label: '测试页面9', path: '/TestPage/9', icon: 'HomeOutlined' },
            { label: '测试页面10', path: '/TestPage/10', icon: 'HomeOutlined' },
            { label: '测试页面11', path: '/TestPage/11', icon: 'HomeOutlined' },
            { label: '测试页面12', path: '/TestPage/12', icon: 'HomeOutlined' },
            { label: '测试页面13', path: '/TestPage/13', icon: 'HomeOutlined' },
            { label: '测试页面14', path: '/TestPage/14', icon: 'HomeOutlined' },
            { label: '测试页面15', path: '/TestPage/15', icon: 'HomeOutlined' },
            { label: '测试页面16', path: '/TestPage/16', icon: 'HomeOutlined' },
            { label: '测试页面17', path: '/TestPage/17', icon: 'HomeOutlined' },
            { label: '测试页面18', path: '/TestPage/18', icon: 'HomeOutlined' },
            { label: '测试页面19', path: '/TestPage/19', icon: 'HomeOutlined' },
            { label: '测试页面20', path: '/TestPage/20', icon: 'HomeOutlined' },
            { label: '测试页面21', path: '/TestPage/21', icon: 'HomeOutlined' },
            { label: '测试页面22', path: '/TestPage/22', icon: 'HomeOutlined' },
            ],
            Mapping: {},
        }
    },
    getters: {
        MenuData() {
            this.EachMenu(this.Menu);
            return this.Menu
        }
    },
    actions: {
        GetMappingLabel(path) {
            if (this.Mapping[path]) {
                return this.Mapping[path].label;
            } else {
                return undefined;
            }
        },
        getIconComponent(name) {
            return h(Icons[name]) || null;
        },
        EachMenu(children) {
            for (let i = 0; i < children.length; i++) {
                const element = children[i];
                this.Mapping[element.path] = element;
                element.key = element.key || element.path;
                if (element.children && element.children.length > 0) {
                    this.EachMenu(element.children);
                };
                if (element.icon && typeof element.icon === 'string') {
                    element.icon = this.getIconComponent(element.icon);
                };
            }
        },
        clear() {
            this.Menu = [];
            this.Mapping = {};
        }
    },
})